<template>
    <span>
      <template v-if="type=='select'">
        <l-select v-model="currentValue" :size="size" :typeCode="typeCode" :multiple="multiple" :clearable="clearable" :placeholder="placeholder" :disabled="disabled" />
      </template>
      <template v-else-if="type=='date'">
        <el-date-picker v-model="currentValue" :size="size" value-format="yyyy-MM-dd" type="date" :disabled="disabled" :placeholder="placeholder" />
      </template>
      <template v-else-if="type=='datetime'">
         <el-date-picker  v-model="currentValue" :size="size" value-format="yyyy-MM-dd HH:mm:ss" :disabled="disabled" type="datetime" :placeholder="placeholder">
          </el-date-picker>
      </template>
      <template v-else-if="type=='date'">
         <el-date-picker  v-model="currentValue" :size="size" value-format="yyyy-MM-dd" :disabled="disabled" type="date" :placeholder="placeholder">
          </el-date-picker>
      </template>
      <template v-else-if="type=='textarea'">
        <el-input   v-model="currentValue" type="textarea" :size="size" :rows="1" :maxlength="maxlength" :show-word-limit="showWordLimit"  :disabled="disabled" :placeholder="placeholder"> </el-input>
      </template>
      <template v-else>
         <el-input v-model="currentValue" :size="size" :disabled="disabled" :maxlength="maxlength" :show-word-limit="showWordLimit" :placeholder="placeholder"/>
      </template>
    </span>
</template>

<script>
    export default {
      name: "LFormItem",
      model: {
        prop: 'value',
        event: 'cv'
      },
      data(){
        return {
          currentValue: this.value
        }
      },
      watch: {
        currentValue(val) {
          this.$emit('cv', val)
        }, value(val) {
          this.currentValue = val;
        }
      },
      created(){

      },
      methods:{

      },
      props:{
        value: {
          type: null
        },
        name: '',
        label: '',
        type: {
          type: String,
          default: 'input'
        },
        length: {
          type: Number,
          default: 60
        },
        typeCode: {
          type: String,
          default: ''
        },
        max: {
          type: Number
        },
        min: {
          type: Number
        },
        placeholder: '',
        size:{
          type: String,
          default:'mini'
        },
        disabled:{
          type: Boolean,
          default: false
        },
        maxlength:{
          type: String
        },
        showWordLimit:{
          type: Boolean,
          default: false
        },
        clearable:{
          type: Boolean,
          default: false
        },
        multiple:{
          type: Boolean,
          default: false
        },
      }
    }
</script>

<style scoped>

</style>
